<template>
	<!--pages/discover/hoicenessCategoryList.wxml-->
	<view class="container">

		<view v-for="(item, index) in choicenessCategoryList" :key="index">
			<view class="itemTitle" @click="toList(item.resourceNum,item.id,item.categoryName,item.type)"
				:data-num="item.resourceNum" :data-id="item.uuid" :data-name="item.categoryName" :data-type="item.type">
				<view class="categoryName">
					<view>{{item.categoryName}}</view><text class="resourceNum">({{item.resourceNum}})</text>
					<view style="width:55rpx;height:5rpx;margin-top:5rpx" class="indicate_line"></view>
				</view>
				<view class="arrow">
					<text>更多</text>
					<image src="/static/images/right_arrow.png"></image>
				</view>
			</view>

			<view class="itemList">
				<view v-for="(childItem, index2) in item.resultArr" :key="index2"
					:class="(index2 % 2 == 0 ? 'mgR':'') + ' itemMain'">
					<view style="width: 100%;">
						<view v-if="item.type == 1" style="width: 100%;">
							<!-- 视频 -->
							<view class="childItem" @click="videoPlay(index,item.resultArr,childItem)"
								:data-index="index" :data-srcList="item.resultArr" :data-id="childItem">
								<image style="width:100%;height:100%"
									:src="childItem+ '?x-oss-process=video/snapshot,t_0,f_jpg'" mode=""></image>
								<view class="play">
									<image style="width:120rpx;height:120rpx" src="/static/images/play.png"></image>
								</view>
							</view>
						</view>
						<view v-else style="width: 100%;">
							<!-- 图片 -->
							<view class="childItem" :data-src="childItem" :data-srcList="item.resultArr"
								@click="imgYu(childItem,item.resultArr)">
								<u-image width="100%" height="312rpx" use-error-slot use-loading-slot :src="childItem">
								</u-image>
							</view>
						</view>
					</view>
				</view>
			</view>

		</view>
	</view>
</template>

<script>
	// pages/discover/hoicenessCategoryList.js
	const app = getApp();
	const util = require("../../../utils/util.js");
	const network = require("../../../manager/network-manager.js");
	const dialog = require("../../../utils/dialog.js");

	export default {
		data() {
			return {
				uuid: '',
				controls: false,
				choicenessCategoryList: [],
				resultsType: {}
			};
		},

		components: {},
		props: {},

		/**
		 * 生命周期函数--监听页面加载
		 */
		onLoad(options) {
			this.setData({
				uuid: options.uuid
			});
			uni.setNavigationBarTitle({
				title: options.title
			})
			this.getChoicenessCategoryList(options.uuid);
		},

		/**
		 * 生命周期函数--监听页面初次渲染完成
		 */
		onReady: function() {},

		/**
		 * 生命周期函数--监听页面显示
		 */
		onShow: function() {
			this.setData({
				controls: false
			});
			app.trackPage(util.getNavigationBarTitle());

		},

		/**
		 * 生命周期函数--监听页面隐藏
		 */
		onHide: function() {},

		/**
		 * 生命周期函数--监听页面卸载
		 */
		onUnload: function() {},

		/**
		 * 页面相关事件处理函数--监听用户下拉动作
		 */
		onPullDownRefresh: function() {},

		/**
		 * 页面上拉触底事件的处理函数
		 */
		onReachBottom: function() {},

		/**
		 * 用户点击右上角分享
		 */
		onShareAppMessage: function() {},
		methods: {
			setData(data) {
				for (let i in data) {
					this[i] = data[i]
				}
			},
			imgYu: function(src, imgList) {
				// console.log(event, 'event'); // return

				var that = this;

				//图片预览

				uni.previewImage({
					current: src,
					urls: imgList
				});
			},

			toList(resourceNum, uuid, categoryName, type) {


				if (resourceNum == 0) {
					return;
				}

				uni.navigateTo({
					url: `/pages/discover/choicenessCategoryList/mediaList/mediaList?uuid=${uuid}&name=${categoryName}&type=${type}`
				});
			},

			videoPlay(index, srclist, item) {
				// console.log(event.currentTarget.dataset, 'event'); // return

				var that = this;
				// var index = event.currentTarget.dataset.index; //获取data-src

				// var vdoList = event.currentTarget.dataset.srclist; //获取data-list

				console.log(srclist);
				var sourcesList = [];

				for (let i in srclist) {
					var obj = {
						'type': 'video',
						'url': srclist[i]
					};
					sourcesList.push(obj);
				} //图片预览


				uni.navigateTo({
					url: `/pages/discover/choicenessCategoryList/videoDetail/videoDetail?src=${item}`
				})

				// uni.previewMedia({
				//   sources: sourcesList,
				//   current: index,
				//   // 当前显示图片的http链接
				//   showmenu: true // 需要预览的图片http链接列表,

				// });
			},
			getMedia(categoryId) {
				var that = this;
				var uri = app.globalData.config.interfaces.URL_CHOICEENESSCATEGORY_MEDIA;
				var params = {
					"pageNum": 1,
					"pageSize": 4,
					"categoryId": categoryId.toString()
				};
				network.get(uri, params, 'form').then(res => {
					uni.stopPullDownRefresh();

					if (res.code == 200) {

						this.choicenessCategoryList.map(item => {
							if (item.id == categoryId) {
								item.resultArr = res.data.list
							}
						})
						console.log(this.choicenessCategoryList)
					} else {
						uni.showToast({
							title: res.message,
							duration: 3000,
							icon: 'none'
						})
					}
				}).catch(res => {
					console.error(res);
					uni.showToast({
						title: res.errMsg,
						duration: 3000,
						icon: 'none'
					})
				});
			},
			getChoicenessCategoryList: function(choicenessId) {
				console.log(choicenessId, '123123');
				var that = this;
				var uri = app.globalData.config.interfaces.URL_CHOICEENESSCATEGORY_LIST;
				var params = {
					"pageNum": 1,
					"pageSize": 5,
					"choicenessId": choicenessId
				};
				network.get(uri, params, 'form').then(res => {
					uni.stopPullDownRefresh();

					if (res.code == 200) {
						var _list = res.data.list;
						console.log(_list, '_list_list_list');

						for (let t in _list) {
							var sourceArr = _list[t].src ? _list[t].src.split(',') : [];
							var resultArr = [];

							for (let i in sourceArr) {
								if (i <= 3) {
									resultArr.push(sourceArr[i]);
								}
							}

							_list[t].resultArr = resultArr;
						}

						//       _list.map(item=>{
						//  console.log(v.id)
						//  that.getMedia(v.id)
						// })
						for (let i = 0; i < _list.length; i++) {
							that.getMedia(_list[i].id)
						}
						console.log(_list)
						that.setData({
							"choicenessCategoryList": _list
						});
					} else {
						uni.showToast({
							title: res.message,
							duration: 3000,
							icon: 'none'
						})
					}
				}).catch(res => {
					console.error(res);
					uni.showToast({
						title: res.errMsg,
						duration: 3000,
						icon: 'none'
					})
				});
			}
		}
	};
</script>
<style>
	@import "./choicenessCategoryList.css";
</style>
